<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <link rel="shortcut icon" href="images/icon.jpg" type="image/x-icon">
      <title>[简历]陈梓炘-网络与新媒体在学学生/广州</title>
</head>
<body>
<body  style=" background-image: url(images/background.jpg);background-repeat:no-repeat ;background-size:100% 100%;
background-attachment: fixed;">
<div class ="clock" >
    <div class="box1" id="h"></div>
    <div class="box2" >:</div>
    <div class="box1" id="m"></div>
    <div class="box2" >:</div>
    <div class="box1" id="s"></div>
  </div>
    <script type="text/javascript">
    var hour =document.getElementById("h");//获取显示小时的区域框对象
    var minute=document.getElementById("m");//获取显示分钟的区域框对象
    var second=document.getElementById("s");//获取显示秒的区域框对象
  
    //获取当前时间
    function getCurrentTime(){
      var date=new Date();
      var h=date.getHours();
      var m=date.getMinutes();
      var s=date.getSeconds();

      if(h<10) h="0"+h;//以确保0~9时也显示成两位数
      if(m<10) m="0"+m;//以确保0~9分钟也显示成两位数
      if(s<10) s="0"+s;//以确保0~9秒也显示成两位数

      hour.innerHTML=h;
      minute.innerHTML=m;
      second.innerHTML=s;

    }
    setInterval("getCurrentTime()",1000);//每秒更新一次时间
  </script>
  
  <ul class="nav">
    
    
  </ul>

  <div class="left_div" style="float: left;">
    <p style="text-align:center">
    <img  src="images/head sculpture.jpg" class="imagetouxiang">  
    </p>
    <p style="text-align:center;font-size:40px;" >陈梓炘</p>
    <p style="text-align:center;color: white;">广州南方学院 网络与新媒体 2022/广州</p>
    <hr style="height:1px;border:none;border-top:1px solid #555555;" />
    <img src="images/information.png" height="30" width="20">
    <span style="color: white;"><b>基本信息</b></span>
    <p style="color: white;">个人信息&emsp;&emsp;&emsp;陈梓炘 / 女 / 21岁</p>
    <p style="color: white;">英语水平&emsp;&emsp;&emsp;CET-4 未考</p>
    <p style="color: white;">计算机水平&emsp;&emsp;一级未考</p>
    <br>
    <hr style="height:1px;border:none;border-top:1px solid #555555;" />
    <img src="images/wechat.png" height="20" width="20">
    <span style="color: white;"><b>联系方式</b></span>
    <li>
    <label style="color: white;">手机</label>
    <a href="tel:15168285219" target="_blank style=" color: white;>&emsp;&emsp;&emsp;158-892-11466</a>
    </li>
    <li>
    <label style="color: white;">邮箱</label>
    <a href="https://mail.qq.com/cgi-bin/frame_html?sid=M7ks9vIlwoUVe2AB&r=c0e9e15ffa9f9d93e49b0f5332bc7ccf" target="_blank">&emsp;&emsp;&emsp;1244647522@qq.com</a>
    </li>
    <li>
    <label style="color: white;">个人主页</label>
    <a href="https://gitee.com/profile" target="_blank">&emsp;https://gitee.com/profile</a>
    </li>
    <li>
    <hr style="height:1px;border:none;border-top:1px solid #555555;" />
    <br> 
    <img src="images/icon.png" height="20" width="20">
    <span style="color: white;"><b>技能点</b></span>
    <li>
    <label style="color: white;">HTML&emsp;&emsp;&emsp;</label>
    <progress value="60" max="100"></progress>
    </li>
    <li>
    <label style="color: white;">CSS&emsp;&emsp;&emsp;&emsp;</label>
    <progress value="70" max="100" class="hot"></progress>
    </li>
    <li>
    <label style="color: white;">JavaScript&emsp;</label>
    <progress value="70" max="100" class="hot"></progress>
    </li>
    <li>
    <label style="color: white;">python &emsp;&emsp;</label>
    <progress value="50" max="100" class="hot"></progress>
    </li>                
    <li>
    <label style="color: white;">MnProgram</label>
    <progress value="50" max="100"class="hot" ></progress>
    </li>
    <br>
    <hr style="height:1px;border:none;border-top:1px solid #555555;" />
    <img src="images/QR code.png"height="25" width="30">
    <span style="color: white;"><b>二维码</b></span>
    <p style="text-align:center;">
    <img src="images/QR.jpg" height="300" width="300" >
    </p>
     <div class="bofangqi">
    <audio controls="controls" loop="loop" >
    <source src="css/千与千寻 .mp3" type="audio/mp3" ></audio>
    </audio>
    <p style="font-size:17px; color: white;">千与千寻</p>
  </div>
  </div>
    <div class="right_div" style="float: left;">
    <img class="xuanzhuan" src="images/experience.png" height="20" width="20">
    <spap style="font-size:22px;color: white;"><b>教育经历</b></span> 
    <hr style="height:1px;border:none;border-top:1px solid #555555;" />
    <p class="biaoti" >·广东省汕头市澄华中学（初中）&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;2015.09-2018.06</p>
    <p style="font-size:18px; color: white;">在初中的三年里我勤恳学习，与同学相处融洽，获得大部分老师的认可，担任副班长一职，三年学习后进入当地的重点高中。</p>
    <p class="biaoti" color: white;>·广东省汕头市苏北中学（高中）&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;2018.09-2021.06</p>
    <p style="font-size:18px; color: white;">在苏北中学渡过了难忘的三年，高中是我第一次的内宿生活的体验，在这三年里经历了许多，也遇到了许多好老师，在心态性格身体各方面都向成熟更进了一步，不过在第一次高考的时候没有达到理想成绩，于是我选择了复读。</p>
    <p class="biaoti">.广东省汕头市澄海中学（高中）&emsp;&emsp;&emsp;&emsp;&emsp;2021.08-2022.06</p>
     <p style="font-size:18px; color: white;">复读的时候我进入了当地排名第一的高中学习，这一年我面临的压力很大，还好遇到了极好的班主任以及同学们，让我能够坚持下来，最后也取得了理想的高考成绩。</p>
    <p class="biaoti">·广州南方学院 - 网络与新媒体专业（本科）&emsp;&emsp;&emsp;&emsp;&emsp;2022.09-至今</p>
    <span style="font-size:18px;color: white;">已于南苑就读2年，其中大一的时候成绩优秀，获得了学院“优秀学生”三等奖，积极参与各种活动，获得了“优秀志愿者”的称号，并且成为了一名入党积极分子。
   </span>
    <br>
    <img class="xuanzhuan" src="images/earth.png" height="20" width="20">
    <span style="font-size:22px; color: white;"><b>在校经历</b></span>
    <hr style="height:1px;border:none;border-top:1px solid #555555;" />
    <img class="xuanzhuan" src="images/sticky note.png" height="20" width="20">
    <span style="font-size:20px;">学业经历</span>
    <p style="font-size:18px; color: white;"><em>大一上学期原就读于市场营销专业，因为此专业是属于我的第三选择，于是在第一学期时我便决定要转到网新这个专业。我对网新的课程兴趣度较高，学习起来更有动力，成绩也较好。</em></p>
    <img class="xuanzhuan" src="images/activity.png" height="20" width="20">
    <span style="font-size:20px;">社团经历</span>
    <p style="font-size:18px; color: white;">于大一上学期加入图书馆志愿者，大一下学期加入图书馆网络中心帮助台</p>
    </div>
    <div class="next_div" style="float: left;">
      <main>
        <img class="xuanzhuan" src="images/route.png" height="20" width="20">
    <span style="font-size:22px; color: white;"><b>对未来的展望</b></span>
       <hr style="height:1px;border:none;border-top:1px solid #555555;" />
       <br>
       <p style="font-size:18px; color: white;">对自身的展望，是先努力学完大学四年的课程，认真按时完成每一次作业，每一次考核，在期末考核中争取取得好成绩，在每一个课程中真正的学到东西，让自己掌握更多的技能，提升自我，提升自己在职场的竞争力，完成课程后也要积极学习，拓宽自己的视野。</p>
       <br>
       <img class="xuanzhuan" src="images/girl.png" height="20" width="20">
    <span style="font-size:22px; color: white;"><b>对自己的期望</b></span>
    <hr style="height:1px;border:none;border-top:1px solid #555555; color: white;" />
    <br>

    <p style="font-size:25px; color: yellow;">且行且看且从容</p>
    <br>
    <p style="font-size:18px; color: white;">对自己的期望就是希望自己更加勇敢一点，更加勤奋一点，更加果断一点，更加细心一点。在人生这一趟旅程中能够时刻保持沉着、冷静的心态，不管面对任何困难和挑战，都能从容不迫地应对，用积极的心态去看待人生的旅程。现下的阶段则是要好好学习课程，不要得过且过，要真的掌握技能，不断提高自身的竞争力。再者能更加处理好学习与社团的关系，安排好时间的分配。最后希望能够利用大学空余的时间段去旅游，去看世界。</p>
      </main>
    </div>
<br>
<footer style="text-align: center; color: white;">
@wy170101 文档最后修改为2024年1月15日 
</footer>
</body>
</html>
<style>
.xuanzhuan{
    animation: rotate 6s linear infinite;
}
a{
  color:white}
  .clock{
    width:800px;
    font-size:80px;
    font-weight:bold;
    color:rgb(220,20,60);
    text-align:center;
    margin-left:425px;
}
.box1{
    margin-right:10px;
    width:100px;
    height:100px;
    line-height:100px;
    float:left;
    
}
.box2{
    width:30px;
    float:left;
    margin-right:10px;
}
.imagetouxiang{
  height: 150px;
  width: 150px;
  border-radius: 100%;
  transition:all 5.0s;
  max-height: 100%;
}
img:hover{
        transform: rotate(360deg);
}
*{
  padding: 0px;
      margin: 0px;
    }
    .nav{
      list-style: none;
      background-image: linear-gradient(to right,#C31432,
#240b36);
      width: 1240px;
      /*height: 45px;*/
      margin-bottom:20px;
      overflow: hidden;
      zoom: 1;
    }
    .nav li{
      float: left;
      width: 25%;
    }
    .nav a{
      width: 100%;
      display: inline-block;
      text-align: center;
      padding: 5px 0px;
      text-decoration: none;
      color: white;
      font-weight: bold;
    }
    .nav a:hover{
      background-color: red;
    }
 progress {
  -webkit-appearance: none;
}

::-webkit-progress-bar {
  background-color:#6A5ACD;
}
 a{text-decoration:none}
 a:hover{text-decoration:none}
 body {
   margin-top:0px;
   margin-right:100px;
   margin-left:150px; 
   float:left;padding:10px;   
 }

.second:hover {
             /*Y轴上表示上升*/
             transform:translateY(120px);
 }
 .left_div {
  border-radius: 20px;
   padding: 10px;
   margin-right:50px ;
     background-image: linear-gradient(to right,#C31432,
#240b36);
     width: 450px;
     height:1100px;
     opacity: 0.8;
}
.bofangqi{
   width:450px;
   height:50px;
   display: flex;
   justify-content: center;
   margin-top: 32px;
   align-items: center;
}
.right_div {
  border-radius: 20px;
      padding: 50px;
        color: #000000;
      background-image: linear-gradient(to right,#7f7fd5,#86A8E7,#91EAE4);
    padding:15px 10px;
    width: 700px;
    height: 550px;
    white-space:normal;
    word-break:break-all;
    word-wrap:break-word;
    animation:myfirst 5s infinite alternate;
    opacity: 0.8;
    }
.next_div {
  margin-top:20px ;
  border-radius: 20px;
      padding: 50px;
        color: #000000;
        background-image: linear-gradient(to right,#C31432,
#240b36);
    padding:15px 10px;
    width: 700px;
    height: 490px;
    white-space:normal;
        word-break:break-all;
        word-wrap:break-word;
        opacity: 0.85;
    }

    img{
      border-radius: 20px;
    }
    .biaoti{
      font-size: 20px;
      color:#0083B0

    }

@keyframes myfirst
{
0%   {background:#F953C6;}
50%  {background:#86A8E7}
100%  {background:#B91D73}
}
@keyframes rotate{
  0%{
    transform: rotateZ(0deg);/*从0度开始*/
  }
  100%{
    transform: rotateZ(360deg);/*360度结束*/
  }
}
</style>